// Learn TypeScript:
//  - https://docs.cocos.com/creator/manual/en/scripting/typescript.html
// Learn Attribute:
//  - https://docs.cocos.com/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - https://docs.cocos.com/creator/manual/en/scripting/life-cycle-callbacks.html

const {ccclass, property} = cc._decorator;
import LegoSyncIns from './LegoSyncIns';
@ccclass
export default class NewClass extends cc.Component {
/**
 * 需求
 * 题干出现和消失动效
 * 提交按钮点击动效
 * 刷新动效
 * 
 * 
 * 百位列：
 *          加号 百位上加一颗珠子 从上往下掉  对应数字3 变成4 
 *          减号 百位上减一颗珠子 从下网上移出  对应数字3 变成2
 * 
 * 音效： 加/减号 珠子下落
 * 
 */ 
    @property(cc.Node)
    surBtnNode: cc.Node = null;

    @property(cc.Node)
    refBtnNode: cc.Node = null;

    @property(cc.Node)
    plusBtnNode: cc.Node = null;

    @property(cc.Node)
    subBtnNode: cc.Node = null;

    @property(cc.Sprite)
    numSprite: cc.Sprite = null;

    @property([cc.SpriteFrame])
    numSpriteFrame: cc.SpriteFrame[] = [];

    @property(cc.Node)
    pear3: cc.Node = null;

    @property(cc.Node)
    pear4: cc.Node = null;

    @property([cc.AudioClip])
    btn_audio: cc.AudioClip[] = [];

    pearl3PosDown: cc.Vec2;
    pearlPosTop: cc.Vec2;
    pearl4PosDown: cc.Vec2;
    pearl3startPos: cc.Vec3;
    pear4StartPos: cc.Vec3;
    currNumber: number;
    ws: WebSocket;
    next = true;
    eventQuen = [];
    // LIFE-CYCLE CALLBACKS:

    onLoad () {
        this.pearlPosTop = cc.v2(39.026,134.951); 
        this.pearl3PosDown = cc.v2(39.026,-73.177); 
        this.pearl4PosDown = cc.v2(39.026,-56); 
        this.pearl3startPos = this.pear3.position;
        this.pear4StartPos = this.pear4.position;
        this.currNumber = 3;
    }

    start () {
        this.pear3.position = this.pearl3startPos;
        this.pear4.position = this.pear4StartPos;
        let num = cc.sys.localStorage.getItem("count_num");
        if (num) {
            this.syncScene(Number(num));
        }
        LegoSyncIns.instance.setReceiveCB(this.receive.bind(this));
    }
    
    receive(data) {
        //根据消息刷新界面
        this.eventQuen.push(data);
    }

    syncScene(num){
        if (this.currNumber == num) {
            this.next = true;
            return;
        }
        this.currNumber = num;
        switch (this.currNumber) {
            case 2:
                this.pear3.position = this.pear4StartPos;
                this.pear4.position =  this.pear4StartPos;
                this.numSprite.spriteFrame = this.numSpriteFrame[0];
                this.next = true;
                break;
            case 3:
                this.refreshEvent(false);
                break;
            case 4:
                this.pear3.position = this.pearl3startPos;
                this.pear4.position =  cc.v3(this.pearl4PosDown.x,this.pearl4PosDown.y,0);
                this.numSprite.spriteFrame = this.numSpriteFrame[2];
                this.next = true;
                break;
            default:
                break;
        }
    }
 
    update (dt) {
        if (this.eventQuen.length && this.next) {
            this.next = false;
            let data = this.eventQuen.shift();
            this.processEvent(data);
        }
    }

    processEvent(data){
        if (data.event == "refresh") {
            this.refreshEvent();
            return;
        }
        this.syncScene(data.num);
        switch (data.event) {
            case "plus":
                this.plusEvent();
                break;
            case "sub":
                this.subEvent();
                break;
            case "sur":
                this.surEvent();
                break;
            default:
                break;
        }
    }

    surBtnClick(){
       LegoSyncIns.instance.sendStatus({event: "sur",num: this.currNumber});
       cc.audioEngine.playEffect(this.btn_audio[0],false);
       this.surEvent();
    }
    surEvent(){
        // let ani = this.surBtnNode.getChildByName("interactive_anNiu").getComponent(cc.Animation);
        // ani.play(ani.getClips()[1].name);
        let ani = this.surBtnNode.getComponent(cc.Animation);
        ani.play(ani.defaultClip.name);
        ani.on("finished",()=>{
            this.surBtnNode.getComponent(cc.Button).interactable = false;
            this.next = true;
        });
    }
    refreshBtnClick(){
        LegoSyncIns.instance.sendStatus({event: "refresh",num: this.currNumber});
        cc.audioEngine.playEffect(this.btn_audio[2],false);
        this.refreshEvent();
    }

    refreshEvent(needRotate = true){
        if (needRotate) {
            this.refBtnNode.runAction(cc.rotateBy(0.5,360));
        }
        this.pear3.position = this.pearl3startPos;
        this.pear4.position = this.pear4StartPos;
        this.numSprite.spriteFrame = this.numSpriteFrame[1];
        this.currNumber = 3
        // let ani = this.surBtnNode.getChildByName("interactive_anNiu").getComponent(cc.Animation);
        // ani.play(ani.getClips()[1].name);
        this.surBtnNode.getComponent(cc.Button).interactable = true;
        cc.sys.localStorage.setItem("count_num",this.currNumber);
        this.next = true;
        this.plusBtnNode.getComponent(cc.Button).interactable = true;
        this.subBtnNode.getComponent(cc.Button).interactable = true;
    }

    plusBtnClick(){
        this.plusBtnNode.getComponent(cc.Button).interactable = false;
        this.subBtnNode.getComponent(cc.Button).interactable = false;
        LegoSyncIns.instance.sendStatus({event: "plus",num: this.currNumber});
        cc.audioEngine.playEffect(this.btn_audio[0],false);
        this.plusEvent();    
    }

    plusEvent(){
        this.currNumber++
        if (this.currNumber > 4) {
            this.currNumber--
            this.plusBtnNode.getComponent(cc.Button).interactable = true;
            this.subBtnNode.getComponent(cc.Button).interactable = true;
            return;
        }
        cc.sys.localStorage.setItem("count_num",this.currNumber);
        let currNode = this.currNumber == 4 ? this.pear4 : this.pear3;
        let pos =  this.currNumber == 4 ?  this.pearl4PosDown :  this.pearl3PosDown
        let action = cc.moveTo(0.5, pos);
        action.easing(cc.easeIn(3.0));
        cc.audioEngine.playEffect(this.btn_audio[1],false);
        currNode.runAction(cc.sequence(action,cc.callFunc(()=>{
            this.numSprite.spriteFrame = this.numSpriteFrame[this.currNumber-2];
            this.next = true;
            this.plusBtnNode.getComponent(cc.Button).interactable = true;
            this.subBtnNode.getComponent(cc.Button).interactable = true;
        })));
    }

    subBtnClick(){
        this.plusBtnNode.getComponent(cc.Button).interactable = false;
        this.subBtnNode.getComponent(cc.Button).interactable = false;
        LegoSyncIns.instance.sendStatus({event: "sub",num: this.currNumber});
        cc.audioEngine.playEffect(this.btn_audio[0],false);
        this.subEvent();
    }

    subEvent(){
        this.currNumber--
        if (this.currNumber < 2) {
            this.currNumber++
            this.plusBtnNode.getComponent(cc.Button).interactable = true;
            this.subBtnNode.getComponent(cc.Button).interactable = true;
            return;
        }
        cc.sys.localStorage.setItem("count_num",this.currNumber);
        let currNode = this.currNumber == 2 ? this.pear3 : this.pear4;
        let action = cc.moveTo(0.5, this.pearlPosTop);
        action.easing(cc.easeIn(3.0));
        // cc.audioEngine.playEffect(this.btn_audio[1],false);
        currNode.runAction(cc.sequence(action,cc.callFunc(()=>{
            this.numSprite.spriteFrame = this.numSpriteFrame[this.currNumber-2];
            this.next = true;
            this.plusBtnNode.getComponent(cc.Button).interactable = true;
            this.subBtnNode.getComponent(cc.Button).interactable = true;
        }))); 
    }

}
